<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <title></title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <!-- basic styles -->
        <link href="../assets/css/bootstrap.min.css" rel="stylesheet" />
        <link rel="stylesheet" href="../assets/css/font-awesome.min.css" />
        <link rel="stylesheet" href="../assets/css/jquery-ui-1.10.3.custom.min.css" />
        <!-- ace styles -->
        <link rel="stylesheet" href="../assets/css/ace.min.css" />
        <link rel="stylesheet" href="../assets/css/ace-rtl.min.css" />
        <link rel="stylesheet" href="../assets/css/ace-skins.min.css" />
        <style>
            strong{line-height: 28px;color:#307ecc}
            .box{border: 1px solid #cccccc; width: 97%;margin: 1%;margin-bottom: 20px;}
            .box strong {
                background-color: #ffffff;
                display: block;
                font-size: 16px;
                margin-left: 30px;
                margin-top: -13px;
                text-align: center;
                width: 110px;
                padding-bottom: 5px;
            }
            .device_static{border-bottom: 1px solid #cccccc;margin-bottom: 20px;}
        </style>
    </head>

    <body>
        <div class="main-container">
            <div class="page-content">
                <div class="row">
                    <div class="col-sm-12">
                        <div class="tabbable">
                            <ul id="myTab" class="nav nav-tabs">
                                <li class="active">
                                    <a href="#device-static-info" data-toggle="tab">
                                        设备静态信息
                                    </a>
                                </li>
                                <li>
                                    <a href="#device-dync-info" data-toggle="tab">
                                        设备动态信息
                                    </a>
                                </li>
                                <li>
                                    <a href="#device-stratagy-info" data-toggle="tab">
                                        设备策略库信息
                                    </a>
                                </li>
                            </ul>

                            <div class="tab-content">
                                <div class="tab-pane in active" id="device-static-info">
                                    <form class="form-horizontal ">
                                        <div class="row device_static">
                                            <div class="col-sm-6">
                                                <div class="form-group">
                                                    <label class="col-sm-6 control-label no-padding-right">设备名称: </label>
                                                    <div class="col-sm-6">
                                                        <strong id="name"></strong>
                                                    </div>
                                                </div>
                                                <div class="form-group">
                                                    <label class="col-sm-6 control-label no-padding-right">设备软件版本号: </label>
                                                    <div class="col-sm-6">
                                                        <strong id="SoftwareVersion"></strong>
                                                    </div>
                                                </div>
                                                <div class="space-4"></div>
                                                <div class="form-group">
                                                    <label class="col-sm-6 control-label no-padding-right">采集类型: </label>
                                                    <div class="col-sm-6">
                                                        <strong id="Probe_Type"></strong>
                                                    </div>
                                                </div>
                                                <div class="space-4"></div>
                                                <div class="form-group">
                                                    <label class="col-sm-6 control-label no-padding-right">DPI设备部署站点名称: </label>
                                                    <div class="col-sm-6">
                                                        <strong id="DeploySiteName"></strong>
                                                    </div>
                                                </div>
                                                <div class="space-4"></div>
                                                <div class="form-group">
                                                    <label class="col-sm-6 control-label no-padding-right">EU设备部署站点名称: </label>
                                                    <div class="col-sm-6">
                                                        <strong id="IDC_HouseID"></strong>
                                                    </div>
                                                </div>
                                                <div class="space-4"></div>
                                                <div class="form-group">
                                                    <label class="col-sm-6 control-label no-padding-right">设备在现网中部署模式: </label>
                                                    <div class="col-sm-6">
                                                        <strong id="Deploy_Mode"></strong>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-sm-6">
                                                <div class="form-group">
                                                    <label class="col-sm-6 control-label no-padding-right">设备地址: </label>
                                                    <div class="col-sm-6">
                                                        <strong id="ip"></strong>
                                                    </div>
                                                </div>
                                                <div class="space-4"></div>
                                                <div class="form-group">
                                                    <label class="col-sm-6 control-label no-padding-right">设备总分析能力: </label>
                                                    <div class="col-sm-6">
                                                        <strong id="Total_Capability"></strong>
                                                    </div>
                                                </div>
                                                <div class="space-4"></div>
                                                <div class="form-group">
                                                    <label class="col-sm-6 control-label no-padding-right">设备总槽位数: </label>
                                                    <div class="col-sm-6">
                                                        <strong id="SlotNum"></strong>
                                                    </div>
                                                </div>
                                                <div class="space-4"></div>
                                                <div class="form-group">
                                                    <label class="col-sm-6 control-label no-padding-right">设备预处理模块占用总槽位数: </label>
                                                    <div class="col-sm-6">
                                                        <strong id="PreProcSlotNum"></strong>
                                                    </div>
                                                </div>
                                                <div class="space-4"></div>
                                                <div class="form-group">
                                                    <label class="col-sm-6 control-label no-padding-right">设备分析模块占用总槽位数: </label>
                                                    <div class="col-sm-6">
                                                        <strong id="AnalysisSlotNum"></strong>
                                                    </div>
                                                </div>
                                                <div class="space-4"></div>
                                                <div class="form-group">
                                                    <label class="col-sm-6 control-label no-padding-right">设备通用模块占用总槽位数: </label>
                                                    <div class="col-sm-6">
                                                        <strong id="GPSlotNum"></strong>
                                                    </div>
                                                </div>
                                                <div class="space-4"></div>
                                            </div>
                                        </div>
                                        <div class="row ports">

                                        </div>
                                    </form>
                                </div>
                                <div class="tab-pane" id="device-dync-info">
                                    <h3 class="row header smaller lighter">
                                        <span class="col-sm-4">
                                            <label class="pull-left inline">
                                                <small class="muted">DPI设备状态</small>
                                                <span id="device_status">未连接</span>
                                            </label>
                                        </span>
                                        <span class="col-sm-4">
                                            <label class="pull-left inline">
                                                <small class="muted">最近一次心跳时间</small>
                                                <span id="lastHeartBeatTime">-</span>
                                            </label>
                                        </span>
                                        <span class="col-sm-4">
                                            <label class="pull-left inline">
                                                <small class="muted">服务端通道SOCKET连接状态：</small>
                                                <span id="isServerChannelConnected">未连接</span>
                                            </label>
                                        </span>                                        
                                        <span class="col-sm-4">
                                            <label class="pull-left inline">
                                                <small class="muted">DPI客户端通道SCOKET连接状态：</small>
                                                <span id="isClientChannelConnected">未连接</span>
                                            </label>
                                        </span>
                                    </h3>
                                    <div class="row">
                                        <div class="col-sm-6 cpu">
                                            <!--                                            <div class="box">
                                                                                            <strong>CPU一信息</strong>
                                                                                            <form class="form-horizontal">
                                                                                                <div class="form-group">
                                                                                                    <label class="col-sm-3 control-label no-padding-right" style="padding-top:0px;"> CPU 编号 </label>
                                                                                                    <div class="col-sm-9">
                                                                                                        <label>
                                                                                                            2013415265
                                                                                                        </label>
                                                                                                    </div>
                                                                                                </div>
                                                                                                <div class="form-group">
                                                                                                    <label class="col-sm-3 control-label no-padding-right" style="padding-top:0px;margin-top:-2px"> CPU 利用率 </label>
                                                                                                    <div class="col-sm-9">
                                                                                                        <div data-percent="66%" class="progress">
                                                                                                            <div style="width:66%;" class="progress-bar"></div>
                                                                                                        </div>
                                                                                                    </div>
                                                                                                </div>
                                                                                            </form>
                                                                                        </div>-->
                                        </div>
                                        <div class="col-sm-6 pt">
                                            <!--                                            <div class="box">
                                                                                            <strong>端口一信息</strong>
                                                                                            <form class="form-horizontal">
                                                                                                <div class="form-group">
                                                                                                    <label class="col-sm-3 control-label no-padding-right" style="padding-top:0px;"> 端口编号 </label>
                                                                                                    <div class="col-sm-9">
                                                                                                        <label>
                                                                                                            2013415265
                                                                                                        </label>
                                                                                                    </div>
                                                                                                </div>
                                            
                                                                                                <div class="form-group">
                                                                                                    <label class="col-sm-3 control-label no-padding-right" style="padding-top:0px;"> 端口描述信息 </label>
                                                                                                    <div class="col-sm-9">
                                                                                                        <label>
                                                                                                            2013415265
                                                                                                        </label>
                                                                                                    </div>
                                                                                                </div>
                                                                                                <div class="form-group">
                                                                                                    <label class="col-sm-3 control-label no-padding-right" style="padding-top:0px;margin-top:-2px"> 端口利用率 </label>
                                                                                                    <div class="col-sm-9">
                                                                                                        <div data-percent="66%" class="progress">
                                                                                                            <div style="width:66%;" class="progress-bar"></div>
                                                                                                        </div>
                                                                                                    </div>
                                                                                                </div>
                                                                                            </form>
                                                                                        </div>-->
                                        </div>
                                    </div>

                                </div>

                                <div class="tab-pane" id="device-stratagy-info">
                                    <h3 class="row header smaller lighter">
                                        <span class="col-sm-12">
                                            <button style="margin-right:10px;" class="btn btn-info btn-sm" id="total-update" type="button" onclick="updateStrategyRepo(0)">全量更新</button>
                                            <button class="btn btn-info btn-sm" id="increment-update" type="button" onclick="updateStrategyRepo(1)">增量更新</button>
                                        </span>
                                    </h3>
                                    <div class="row policyDepot">
                                        <!--                                        <div class="col-sm-6">
                                                                                    <form class="form-horizontal">
                                                                                        <div class="form-group">
                                                                                            <label class="col-sm-3 control-label no-padding-right"> 通用参数策略 </label>
                                                                                            <div class="col-sm-9">
                                                                                                <strong>通用参数设置库1</strong>
                                                                                            </div>
                                                                                        </div>
                                                                                    </form> 
                                                                                </div>-->
                                    </div>

                                </div>
                            </div>
                        </div>
                    </div><!-- /span -->

                </div>

            </div>
        </div>



        <!-- basic scripts -->

        <!--[if !IE]> -->

        <script src="../assets/js/jquery.js"></script>
        <script src="../assets/js/bootstrap.min.js"></script>
        <!-- ace scripts -->
        <script src="../assets/js/ace-elements.min.js"></script>
        <script src="../assets/js/ace.min.js"></script>
        <script src="../assets/js/Base64.js"></script>
        <script src="../assets/js/logic/device.js"></script>
        <script>
            var base64 = new Base64();
            var id = getQueryString("id");
            var name = base64.decode(getQueryString("name"));
            var ip = getQueryString("ip");
            
            var device_strategy, dpi_strategy_ver;
            $(function () {
                $("#name").text(name);
                $("#ip").text(ip);
                getDeviceStatic(id);
                getDeviceDynamic(id);
                getDevicePolicyDepot(id);
                setInterval(function () {
                    parent.$("#page-content").attr("height", $("html").height());
                }, 500);
            });
        </script>
    </body>
</html>
